import 'dart:ui';

import 'package:animated_float_action_button/animated_floating_action_button.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:image_picker/image_picker.dart';
import 'package:sui_shou_pai/camera/camera_page.dart';
import 'package:sui_shou_pai/chat/chat_page.dart';
import 'package:sui_shou_pai/my/init_info/init_information.dart';
import 'package:sui_shou_pai/my/my_page.dart';
import 'package:sui_shou_pai/news/news_page.dart';
import 'package:sui_shou_pai/record/record_page.dart';
import 'package:sui_shou_pai/utils/storage_util.dart';

import 'color.dart';
import 'effect.dart';

class FramePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _FramePageState();
}

class _FramePageState extends State<FramePage> {
  int _index = 0;
  PageController _pageController;
  String role;

  initRole() async {
    role = await StorageUtil.getStringItem("role");
  }

  @override
  initState() {
    super.initState();
    InitInformation.initData();
    _pageController = PageController();
    initRole();
  }

  @override
  Widget build(BuildContext context) {
    double screenWidth = MediaQuery.of(context).size.width;

    return Material(
        color: Color.fromARGB(255, 240, 240, 240),
        child: Stack(
          alignment: AlignmentDirectional.center,
          children: <Widget>[
            Container(
              margin: EdgeInsets.only(bottom: 85),
              child: initPageView(),
            ),
            Positioned(
              // bottom: 24,
              bottom: 0,
              child: initBottomNavBar(screenWidth),
            ),
            judgeUser()
          ],
        ));
  }

  Widget judgeUser() {
    if (role == "boss") {
      return Positioned(
          // bottom: 54,
          bottom: 44,
          child: initBottomNavBarCenterButton());
    } else {
      return Positioned(
        // bottom: 54,
        bottom: 44,
        child: Image.asset(
          'assets/images/logo.png',
          height: 54,
        ),
      );
    }
  }

  Widget initPageView() {
    return PageView(
      controller: _pageController,
      physics: NeverScrollableScrollPhysics(),
      onPageChanged: (index) {
        setState(() {
          _index = index;
        });
      },
      children: <Widget>[
        NewsPage(),
        RecordPage(),
        CameraPage(),
        ChatPage(),
        MyPage()
      ],
    );
  }

  // Widget initBottomNavBar(double screenWidth) {
  //   return Container(
  //     decoration: BoxDecoration(
  //       boxShadow: [shadowNoOffset()],
  //       borderRadius: borderRadiusAll40(),
  //     ),
  //     child: ClipRRect(
  //       borderRadius: borderRadiusAll40(),
  //       child: BackdropFilter(
  //         filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12),
  //         child: Container(
  //           width: screenWidth - 32,
  //           height: 74,
  //           color: white80,
  //           padding: EdgeInsets.symmetric(vertical: 15, horizontal: 24),
  //           child: Row(
  //               mainAxisAlignment: MainAxisAlignment.spaceAround,
  //               children: <Widget>[
  //                 initBottomNavBarButton(Icons.article, '资讯', 0, _index == 0),
  //                 initBottomNavBarButton(Icons.all_inbox, '记录', 1, _index == 1),
  //                 initBottomNavBarCenterSpace(),
  //                 initBottomNavBarButton(
  //                     Icons.chat_bubble, '沟通', 3, _index == 3),
  //                 initBottomNavBarButton(
  //                     Icons.account_box, '我的', 4, _index == 4),
  //               ]),
  //         ),
  //       ),
  //     ),
  //   );
  // }

  Widget initBottomNavBar(double screenWidth) {
    return Container(
      decoration: BoxDecoration(
        boxShadow: [shadowNoOffset()],
      ),
      child: ClipRRect(
        child: BackdropFilter(
          filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12),
          child: Container(
            width: screenWidth,
            height: 86,
            color: white80,
            padding: EdgeInsets.symmetric(vertical: 16, horizontal: 24),
            child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: <Widget>[
                  initBottomNavBarButton(Icons.article, '资讯', 0, _index == 0),
                  initBottomNavBarButton(Icons.all_inbox, '记录', 1, _index == 1),
                  initBottomNavBarCenterSpace(),
                  initBottomNavBarButton(
                      Icons.chat_bubble, '沟通', 3, _index == 3),
                  initBottomNavBarButton(
                      Icons.account_box, '我的', 4, _index == 4),
                ]),
          ),
        ),
      ),
    );
  }

  Widget initBottomNavBarButton(
      IconData icon, String label, int index, bool isSelected) {
    return GestureDetector(
      child: Column(
        children: <Widget>[
          Icon(
            icon,
            size: 26,
            color: isSelected ? Colors.blue : Colors.grey,
          ),
          Text(label,
              style: TextStyle(
                  color: isSelected ? Colors.blue : Colors.grey,
                  fontSize: 12,
                  letterSpacing: 1)),
        ],
      ),
      onTap: () {
        setState(() {
          _index = index;
        });
        _pageController.jumpToPage(index);
      },
    );
  }

  Widget initBottomNavBarCenterSpace() {
    return Container(
      width: 36,
    );
  }

  Widget initBottomNavBarCenterButton() {
    return Container(
      child: AnimatedFloatingActionButton(
          fabButtons: <Widget>[
            Container(
                decoration: BoxDecoration(
                  boxShadow: [shadowNoOffset()],
                  borderRadius: borderRadiusAll8(),
                ),
                child: ClipRRect(
                  borderRadius: borderRadiusAll8(),
                  child: BackdropFilter(
                      filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12),
                      child: Container(
                        height: 80,
                        width: 180,
                        padding: EdgeInsets.symmetric(vertical: 18),
                        color: white80,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: [
                            GestureDetector(
                              child: Column(
                                children: <Widget>[
                                  Icon(
                                    Icons.photo,
                                    size: 26,
                                  ),
                                  Text('相册',
                                      style: TextStyle(
                                          fontSize: 12, letterSpacing: 1)),
                                ],
                              ),
                              onTap: () {
                                _choosePhoto();
                              },
                            ),
                            GestureDetector(
                              child: Column(
                                children: <Widget>[
                                  Icon(
                                    Icons.photo_camera,
                                    size: 26,
                                  ),
                                  Text('拍照',
                                      style: TextStyle(
                                          fontSize: 12, letterSpacing: 1)),
                                ],
                              ),
                              onTap: () {
                                _takePhoto();
                              },
                            )
                          ],
                        ),
                      )),
                ))
          ],
          colorStartAnimation: Colors.blue,
          colorEndAnimation: Colors.blue,
          animatedIconData: AnimatedIcons.menu_close),
    );
  }

  _takePhoto() async {
    ImagePicker.platform
        .pickImage(source: ImageSource.camera, imageQuality: 50)
        .then((value) {
      if (value != null) {
        setState(() {
          Navigator.push(
              context,
              new MaterialPageRoute(
                  builder: (context) => CameraPage(image: value.path)));
        });
      }
    });
  }

  _choosePhoto() async {
    ImagePicker.platform
        .pickImage(source: ImageSource.gallery, imageQuality: 50)
        .then((value) {
      if (value != null) {
        setState(() {
          print(value.path);
          Navigator.push(
              context,
              new MaterialPageRoute(
                  builder: (context) => CameraPage(image: value.path)));
        });
      }
    });
  }
}
